
import { Button, Space, Table, Modal, FormInstance, Form, Input } from 'antd'
import { Component, createRef, RefObject } from 'react'
import { IAdmin } from '../pages/admin/AdminList';
import TeamInfoApi from '../api/team_info'
import { factory } from 'typescript';
const layout = {
    labelCol: { span: 4 },
    wrapperCol: { span: 16 }
}

const tailLayout = {
    wrapperCol: { effect: 4, span: 16 }
}
type propType = {
    visible: boolean
    callback: (reflash?: boolean) => void
    formFileds: any[]
    choseid: number

};
type StateType = {
    // visible: boolean
    // 回调
    data: Object

};

interface Modif {
    state: StateType;
    props: propType
}



class Modif extends Component {
    formRef: RefObject<FormInstance>

    constructor(props: StateType) {
        super(props)
        this.formRef = createRef<FormInstance>()
        this.state = {
            data: { Id: 12 }
        }
    }
    addAdmin(admin: IAdmin) {
        console.log(admin)
        console.log("执行 addAdmin 函数")
        if (this.props.choseid==0){
            // 添加逻辑
        }else{
            // 修改逻辑
        }
    }
    // 取消
    cancel = () => {
        this.props.callback()
    }
    // 获取单个信息 
    getOneValue = (id: number) => {
        TeamInfoApi.getOne(id.toString()).then(res => {
            this.formRef.current?.setFieldsValue(res.data)
            console.log(this.formRef.current?.getFieldsValue())
            this.setState({
                data: res.data
            })

        }

        )

    }
    componentWillReceiveProps() {
        this.getOneValue(this.props.choseid)
    }
    render() {

        return (
            <Modal title="Basic Modal"
                visible={this.props.visible}
                footer={null}
                onCancel={this.cancel}
            >

                <Form ref={this.formRef}
                    {...layout}

                    initialValues={this.state.data}
                    onFinish={this.addAdmin}>
                    {
                        this.props.formFileds.map(r => {
                            if (r.show) {
                                return (
                                    <Form.Item key={r.dataIndex} name={r.dataIndex} label={r.title}>
                                        <Input />
                                    </Form.Item>
                                )
                            }
                        })
                    }


                    {/* <Form.Item name='name' label='用户名'>
                        <Input />
                    </Form.Item>
                    <Form.Item name='mobile' label='电话'>
                        <Input />
                    </Form.Item> */}


                    {/* 提交按钮 */}
                    <Form.Item {...tailLayout} >
                        <Button type="primary" htmlType="submit">
                            Submit
                        </Button>
                        &nbsp;
                        <Button type="default" htmlType="reset">
                            Reset
                        </Button>
                    </Form.Item>

                </Form>

            </Modal>
        )
    }
}


export default Modif

